<!DOCTYPE html>
<html>
<head>
	<link rel="stylesheet" type="text/css" href="styles.css">
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    <script>
	  $(document).ready(function() {
		$("#accordion").accordion();
	  });
  	</script>
    <script>
		jQuery(document).ready(function(){
		$('.accordion .head').click(function() {
		$(this).next().toggle();
		return false;
		}).next().hide();
		});
	</script>
</head>
<body>
	<div id="main_bg">
		<div id="title_page">
			<h1>e-Learning+</h1>
		</div>
		<hr>
		<div id="page_header">
			<div id="nav">
				<a href="/e-learning+/profile" id="link">My profile</a>
				<a href="/e-learning+" id="signout">Sign out</a>
			</div>
		</div>
		<div id="content">
			<a href="/e-learning+/main" style="color:#2180CE;font-size:30px;text-decoration:none;font-weight:bold;">Virtual Classroom </font></a>
            <br><a href="/e-learning+/main" style="color:#2180CE;font-size:15px;text-decoration:none;font-weight:bold; text-align:left">Follow Class </font></a>
			<table width="500" height="500" bgcolor="#CCCCCC" border="5">
            	<tr>
                	<td> All Class</td>
                </tr>
                <tr>
                	<td>
                    <div id="accordion">
                        <h3><a href="#">Elementary School</a></h3>
                        <div>
                         	<div id="accordion">
								<h3><a href="#">Matematika</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                                <h3><a href="#">Bahasa Indonesia</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                            </div>   
                        </div>
                        <h3><a href="#">Junior High School</a></h3>
                        <div>
                            <div id="accordion">
								<h3><a href="#">Matematika</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                                <h3><a href="#">Bahasa Indonesia</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                            </div>   
                        </div>
                        <h3><a href="#">Senior High School</a></h3>
                        <div>
                            <div id="accordion">
								<h3><a href="#">Matematika</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                                <h3><a href="#">Bahasa Indonesia</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                            </div>   
                        </div>
                        <h3><a href="#">Collage</a></h3>
                        <div>
                            <div id="accordion">
								<h3><a href="#">Kalkulus</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                                <h3><a href="#">Bahasa Indonesia</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                                <h3><a href="#">Pemrograman Komputer</a></h3>
                                <div>
                                	<p> a</p>
                                </div>
                            </div>   
                        </div>
                     </td>
                </tr>
                <tr>
                	<td><button > + </button></td>
                </tr>
            </table>
           
		</div>
	</div>
</body>

</html>